<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>问卷</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
	<style>
		.container {
			margin-top: 30px;
		}
	</style>
	<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
	<script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js"></script>
</head>
<body>
	<div class="container">
		<div>
			<img src="./assets/1.jpg" alt="" width="100%">
		</div>
		<div>
			<div class="form-group">
				<label for="userName">姓名</label>
				<input type="text" class="form-control" id="userName" placeholder="姓名">
			</div>
			<div class="form-group">
				<label for="account">工号</label>
				<input type="text" class="form-control" id="account" placeholder="工号">
			</div>
			<div class="form-group">
				<label for="title">名称</label>
				<input type="text" class="form-control" id="title" placeholder="名字">
			</div>
			<div class="form-group">
				<label for="content">内容</label>
				<textarea type="text" class="form-control" id="content" placeholder="在此填写名称寓意"></textarea>
			</div>
			<button class="btn btn-primary btn-lg btn-block" onclick="submit()">提交</button>
		</div>
	</div>

<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
	<script>
		function submit() {
			const params = {
				userName: document.querySelector('#userName').value,
				account: document.querySelector('#account').value,
				title: document.querySelector('#title').value,
				content: document.querySelector('#content').value,
			}
			if(!params.userName) alert('姓名必填!') return
			if(!params.account) alert('工号必填!') return
			if(!params.title) alert('名称必填!') return
			if(!params.content) alert('寓意必填!') return
			axios.post('http://120.79.48.116:3000/api/wj', params).then((res) => {
				console.log(res)
				alert('提交成功!')
			})
		}

	</script>
</body>
</html>